layui.define(['layer', 'element', 'form', 'upload'], function (exports) {
    let layer = layui.layer,
        element = layui.element,
        upload = layui.upload;
    var obj = {
        render: function (e) {
            var files,
                trAll,
                tableList = e.tableList,
                elem = e.elem,
                bindAction = e.bindAction,
                url = e.url,
                size = e.size,
                exts = e.exts,
                field = e.field;

            function operate() {
                $('.file-upper').off('click').click(function () {
                    $(this).siblings('.file-lower').removeClass('layui-hide');
                    let tr = $(this).parents('tr');
                    let tr_index = tr.index();
                    let temp = tr.html();
                    trAll = $(tableList + ' tr');
                    let next = trAll.eq(tr_index - 1);
                    tr.html(next.html());
                    next.html(temp);
                    trPublic()
                    operate()
                });
                $('.file-lower').off('click').click(function () {
                    let tr = $(this).parents('tr');
                    let tr_index = tr.index();
                    let temp = tr.html();
                    trAll = $(tableList + ' tr');
                    let next = trAll.eq(tr_index + 1);
                    tr.html(next.html());
                    next.html(temp);
                    trPublic()
                    operate()
                });
                $('.look').off('click').click(function(){
                    let url = $(this).data('url');
                    window.open(url);
                })
                $('.file-del').off('click').click(function () {
                    $(this).parents('tr').remove();
                    trPublic();
                })
            }

            // 整理按钮显示隐藏
            function trPublic() {
                trAll = $(tableList + ' tr');
                trAll.find('.file-upper').removeClass('layui-hide');
                trAll.eq('1').find('.file-upper').addClass('layui-hide');
                trAll.find('.file-lower').removeClass('layui-hide');
                trAll.eq((trAll.length - 1)).find('.file-lower').addClass('layui-hide');
            }
            operate();
            // 获取文件大小
            function format_size(size, delimiter = '') {
                $units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];
                for (var i = 0; size >= 1024 && i < 5; i++) {
                    size /= 1024;
                }
                return size.toFixed(2) + delimiter + $units[i];
            }
            // 获取文件类型
            function getType(file) {
                sear = new RegExp('application')
                if (file.type == '' || file.type == undefined || file.type == null || sear.test(file.type)) {
                    return file.name.split('.').pop();
                }
                return file.type.split('/').pop();
            }
            let uploadInst = upload.render({
                elem: elem,
                url: url,
                data: {},
                accept: 'file',
                auto: false,
                bindAction: bindAction,
                multiple: true,
                size: size,
                exts: exts,
                choose: function (obj) {
                    files = obj.pushFile();
                    $(tableList).removeClass("layui-hide");
                    $(bindAction).removeClass("layui-hide");
                    obj.preview(function (index, file, result) {
                        let tr = "<tr id='upload-" +
                            index + "'>" + "<td>" + file
                            .name +
                            "<input type='hidden' name='" + field + "[]' id='file_" +
                            index + "'></td>" +
                            "<td>" + format_size(file
                                .size) +
                            "</td>" + "<td>" + getType(
                                file) +
                            "</td><td > <div id='status_" +
                            index + "'> 等待上传 </div>     <div class='layui-progress  layui-hide' id='progress_" +
                            index + "' lay-showPercent='yes' lay-filter='progress_" +
                            index + "'> <div class='layui-progress-bar layui-bg-red' lay-percent='0%'></div> </div> </td><td>" +
                            "<button  class='layui-btn layui-mini layui-bg-cyan file-upper  layui-hide' type='button'>上移</button> <button class='layui-btn layui-mini layui-bg-blue file-lower  layui-hide '  type='button'>下移</button> <button class='layui-btn layui-mini file-reload  layui-hide' type='button'>重新上传</button> <button class='layui-btn layui-mini  layui-hide look' data-url='' id='look_" + index + "' type='button'>查看</button>";

                        tr +=
                            "<button class='layui-btn layui-mini layui-btn-danger file-del'  id='" + index + "'type='button'>删除</button></td></tr>";

                        $(tableList).append(tr);
                        $(".file-reload").on("click",
                            function () {
                                obj.upload(index, file);
                            });
                        $(".file-del").on("click",
                            function () {
                                let delIndex = $(this).attr('id');
                                delete files[delIndex];
                            })
                        operate();
                    });
                },
                allDone: function (obj) { //当文件全部被提交后，才触发
                    // console.log(obj.total); //得到总文件数
                    // console.log(obj.successful); //请求成功的文件数
                    // console.log(obj.aborted); //请求失败的文件数
                },
                progress: function (n, elem, res, index) {
                    var percent = n + '%';
                    $('#status_' + index).hide();
                    $('#progress_' + index).show();
                    element.progress('progress_' + index, percent);
                },
                done: function (res, index, upload) { //上传后的回调
                    if (res.code == 1) { //上传成功
                        var tr = $('tr#upload-' + index),
                            tds = tr.children();
                        $('#progress_' + index).hide();
                        $('#status_' + index).html(
                            "<span style='color:#5FB878;'>上传成功</span>"
                        ).show();
                        $('#look_'+index).data('url',res.data.url).removeClass('layui-hide');
                        tds.find(".file-reload").addClass("layui-hide"); //清空操作
                        trAll = $(tableList + ' tr');
                        operate();
                        trPublic();

                        $('#file_' + index).val(JSON.stringify(res
                            .data));
                        delete files[index];
                        if ($.isEmptyObject(files)) {
                            $(bindAction).addClass("layui-hide");

                        }
                        return;
                    } else {
                        var tr = $(tableList).find('tr#upload-' +
                                index),
                            tds = tr.children();
                        $('#status_' + index).html(
                            "<span style='color:#FF5722;'>上传失败</span>"
                        )
                        tds.find(".file-reload").removeClass(
                            "layui-hide"); //清空操作
                        layer.msg(res.msg, {
                            icon: 2
                        });
                    }
                },
                error: function (index, upload) {
                    var tr = $(tableList).find('tr#upload-' +
                            index),
                        tds = tr.children();
                    $('#status_' + index).html(
                        "<span style='color:#FF5722;'>上传失败</span>"
                    )
                    tds.find(".file-reload").removeClass(
                        "layui-hide"); //清空操作
                }
            })
        }
    };
    exports('layFile', obj);

})